<template>
    <div class="wrap">
       <el-container>
            <el-header>关于融惠通</el-header>
            <el-container>
                <el-aside width="80px">
                  <div class="left">
            <span>申請</span>
            <span @click="tolist">列表</span>
            <span>xxx</span>
          </div>
                </el-aside>
                <el-main>
                    <el-form ref="form" :model="sizeForm" label-width="80px" size="mini">                      
                        <el-form-item label="身份证号">
                          <el-input v-model="sizeForm.idCard"></el-input>
                        </el-form-item>
                         <el-form-item label="证书编号">
                          <el-input v-model="sizeForm.certificateNumber"></el-input>
                        </el-form-item>
                         <el-form-item label="商家名称">
                          <el-input v-model="sizeForm.merchantName"></el-input>
                        </el-form-item>
                         <el-form-item label="商家地址">
                          <el-input v-model="sizeForm.merchantSite"></el-input>
                        </el-form-item>
                         <el-form-item size="large">
                          <el-button type="primary" @click="submit">申请二维码</el-button>
                        </el-form-item>
                      </el-form>
                      
                </el-main>
            </el-container>
        </el-container>
    </div>
    
</template>
<script>
// import toptab from '../../components/toptab.vue'
export default {
    data(){
        return{
          sizeForm: {
          idCard:'',   //身份证号
          certificateNumber:'',  // 证书编号
          merchantName:'',     //商家名称
          merchantSite:''   //商家地址
          }
        }
    },
    methods:{
        submit(){
			     let userId = localStorage.getItem('id');
           console.log(userId);
           this.$api.getmerchantmessage({
               userId:userId,
               idCard:this.sizeForm.idCard,
               certificateNumber:this.sizeForm.certificateNumber,
               merchantName:this.sizeForm.merchantName,
               merchantSite:this.merchantSite
           }).then(value =>{
              let xxid = value.data.id
              localStorage.setItem('xxid',value.data.id);
              this.$api.getrqcode({
                id:xxid
              }).then(value =>{
                alert("商家二維碼已申請成功")
              })
           })
           this.$router.push({path:'download', query:{ id:'0'}})
          
        },
        tolist(){
          this.$router.push({path:'list', query:{ id:'0'}})
        }
    }
    
}

</script>
<style>sumit
 .el-header, .el-footer {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
    line-height: 60px;
  }
  
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 200px;
     line-height: 31vh;
  }
  
  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: center;
    line-height: 160px;
  }
  
  body > .el-container {
    margin-bottom: 40px;
  }
  
  .el-container:nth-child(5) .el-aside,
  .el-container:nth-child(6) .el-aside {
    line-height: 260px;
  }
  
  .el-container:nth-child(7) .el-aside {
    line-height: 320px;
  }
  .left span {
  height: 80%;
  display: flex;
  flex-direction: column;
  border: 1px solid #eee;
}
</style>